<template>
  <div class="main">
    <mine-title>设备参数详情</mine-title>
    <div class="content" v-loading="loading">
      <el-row :gutter="20">
        <el-col :span="12">
          <div>
            <el-form
              ref="form"
              :model="form"
              label-width="110px"
              :rules="rules"
            >
              <el-form-item label="参数名称：" prop="paramName">
                <el-input
                  v-model="form.paramName"
                  size="small"
                  clearable
                  style="width: 512px"
                ></el-input>
              </el-form-item>
              <el-form-item label="参数类型" prop="paramType">
                <el-select
                  v-model="form.paramType"
                  placeholder="选择参数类型"
                  style="width: 512px"
                >
                  <el-option label="数值" :value="1"></el-option>
                  <el-option label="字符串" :value="2"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="维修类别" prop="repairType">
                <el-select
                  v-model="form.repairType"
                  placeholder="选择维修类别"
                  style="width: 512px"
                >
                  <el-option label="事后维修" :value="1"></el-option>
                  <el-option label="定期维修" :value="2"></el-option>
                  <el-option label="视情维修" :value="3"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="维修方式" prop="repairMethod">
                <el-select
                  v-model="form.repairMethod"
                  placeholder="选择维修方式"
                  style="width: 512px"
                >
                  <el-option label="维修保养" :value="1"></el-option>
                  <el-option label="更换备件" :value="2"></el-option>
                  <el-option label="原件修复" :value="3"></el-option>
                </el-select>
              </el-form-item>
              <!-- <el-form-item label="是否LRU：" prop="productUnit">
                                <el-input
                                    v-model="form.productUnit"
                                    size="small"
                                    clearable
                                ></el-input>
                            </el-form-item> -->
              <!-- <el-form-item label="备注：" prop="remark">
                <el-input
                  type="textarea"
                  v-model="form.remark"
                  style="width: 512px"
                ></el-input>
              </el-form-item> -->
              <el-form-item class="form-btn-row">
                <mine-button type="primary" @click="onCancel" secondary
                  >取 消</mine-button
                >
                <mine-button type="primary" @click="onSubmit"
                  >保 存</mine-button
                >
              </el-form-item>
            </el-form>
          </div>
        </el-col>
        <el-col :span="12"> </el-col>
      </el-row>
    </div>
  </div>
</template>

<script>
import request from "@/modules/index/utils/request";
import { QWebChannel } from "@/modules/index/utils/qwebchannel.js";
export default {
  name: "InstanceDetail",
  data() {
    return {
      form: {
        name: "",
        catalogId: "",
        paramName: "",
        paramType: "",
        repairType: "",
        repairMethod: "",
        remark: "",
        createTime: "",
      },
      rules: {
        paramName: [
          {
            required: true,
            message: "请填写参数名称",
            trigger: "blur",
          },
        ],
        paramType: [
          {
            required: true,
            message: "请选择参数类型",
            trigger: "blur",
          },
        ],
      },
      fileList: [],
      loading: false,
      downloading: false,
    };
  },
  computed: {
    accept() {
      return ".jpg, .jpeg, .png";
    },
  },
  methods: {
    async init() {
      await this.getInstance();
    },
    getInstance: async function () {
      let id = this.$route.query.id;
      let params = id;
      try {
        this.loading = true;

        let res = {};
        let _self = this;
        if (_self.$qwebUtil.isQtClient) {
          const uuid = _self.$qwebUtil.generateRandomUUID();
          let sendObject;
          /* eslint-disable-next-line */
          const channel = new QWebChannel(
            window.qt.webChannelTransport,
            async function (channel) {
              sendObject = channel.objects.sendObject;
              // receivedJSON 修改此处发送请求参数
              const receivedJSON = {
                RequestUrl: `/equipCheck/getById?id=${params}`,
                RequestMethod: "get",
                ContentType: "application/json;charset=UTF-8",
                RequestBody: {},
                isStringParam: false,
                requestId: uuid,
              };
              await send();
              await _self.$qwebUtil.receive(sendObject, receivedJSON);
              // console.error('received','/feCanvas/pageList')
            }
          );
          /* eslint-disable-next-line */
          async function send() {
            sendObject.sendMessage.connect(function (data) {
              if (!data) {
                console.error("No data received.");
              }
              res = JSON.parse(data);
              const result = res.response || {};
              // update the followings
              if (result.success && res.webInfo.requestId == uuid) {
                const data = result.data || {};
                _self.form = data;
                _self.loading = false;
              }
            });
          }
        } else if (this.$webview2.isWPF) {
          await this.$webview2.sendWebView2(
            `/equipCheck/getById?id=${params}`,
            "get",
            "application/json;charset=UTF-8",
            {},
            false
          );
          await window.chrome.webview.addEventListener("message", (e) => {
            const res = e.data.response;
            const result = res || {};
            this.form = result.data;
            this.loading = false;
          });
        } else {
          const res = await this.$store.dispatch("equipCheckListById", params);
          const result = res.data || {};
          if (result.success) {
            const data = result.data || {};
            this.form = data;
            this.loading = false;
            // console.log(this.form);
          }
        }
      } catch (e) {
        console.error(e);
        this.loading = false;
      }
    },
    onSubmit() {
      let _this = this;
      this.$refs.form.validate(async (valid, object) => {
        let { form } = _this;
        if (valid) {
          // console.log(form);
          this.loading = true;

          let res = {};
          let _self = this;
          if (_self.$qwebUtil.isQtClient) {
            const uuid = _self.$qwebUtil.generateRandomUUID();
            let sendObject;
            /* eslint-disable-next-line */
            const channel = new QWebChannel(
              window.qt.webChannelTransport,
              async function (channel) {
                sendObject = channel.objects.sendObject;
                // receivedJSON 修改此处发送请求参数
                const receivedJSON = {
                  RequestUrl: "/equipCheck/saveOrUpdate",
                  RequestMethod: "post",
                  ContentType: "application/json;charset=UTF-8",
                  RequestBody: form,
                  isStringParam: false,
                  requestId: uuid,
                };
                await send();
                await _self.$qwebUtil.receive(sendObject, receivedJSON);
                // console.error('received','/feCanvas/pageList')
              }
            );
            /* eslint-disable-next-line */
            async function send() {
              sendObject.sendMessage.connect(function (data) {
                if (!data) {
                  console.error("No data received.");
                }
                res = JSON.parse(data);
                const result = res.response || {};
                // update the followings
                if (result.success && res.webInfo.requestId == uuid) {
                  _self
                    .$confirm("保存成功，是否需要返回列表？", "提示", {
                      confirmButtonText: "确定",
                      cancelButtonText: "取消",
                      type: "warning",
                    })
                    .then(() => {
                      _self.$router.push("/equipAdmin/instance");
                    })
                    .catch(() => {
                      _self.loading = false;
                    });
                } else {
                  _self.$message.error(result.msg || "新建失败");
                }
              });
            }
          } else if (this.$webview2.isWPF) {
            await this.$webview2.sendWebView2(
              "/equipCheck/saveOrUpdate",
              "post",
              "application/json;charset=UTF-8",
              form,
              false
            );
            await window.chrome.webview.addEventListener(
              "message",
              (e) => {
                let result = e.data.response;
                console.log(result);
                if (!result.success) {
                  this.loading = false;
                  this.$message.error(result.msg || "新建失败");
                  return;
                }
                this.$confirm("保存成功，是否需要返回列表？", "提示", {
                  confirmButtonText: "确定",
                  cancelButtonText: "取消",
                  type: "warning",
                })
                  .then(() => {
                    this.$router.push("/equipAdmin/instance");
                  })
                  .catch(() => {
                    this.loading = false;
                  });
              },
              {
                once: true,
              }
            );
          } else {
            request({
              url: "equipCheck/saveOrUpdate", //接口
              method: "post",
              data: form,
            }).then((response) => {
              let result = response.data;
              // console.log(response)
              if (!result.success) {
                this.loading = false;
                this.$message.error(result.msg || "新建失败");
                return;
              }
              this.$confirm("保存成功，是否需要返回列表？", "提示", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning",
              })
                .then(() => {
                  this.$router.push("/equipAdmin/instance");
                })
                .catch(() => {
                  this.loading = false;
                });
              // _this.onSubmitFile(result.data.id);
            });
          }
        } else {
          return false;
        }
      });
    },
    onCancel() {
      this.$router.push("/equipAdmin/instance");
      this.form = {
        name: "",
        catalogId: "",
        paramName: "",
        paramType: "",
        repairType: "",
        repairMethod: "",
        remark: "",
        createTime: "",
      };
    },
  },
  created() {
    this.form.catalogId = this.$store.state.dataSysAdmin.currentParamId;
    this.init();
    this.$store.commit("SET_BREADCRUMB", [
      { title: "设备型号管理", path: "/equipAdmin/instance" },
      { title: "参数详情", path: "" },
    ]);
  },
  mounted() {},
};
</script>

<style scoped></style>
